<template>
	<view class="container">
		<uni-section title="案件信息" type="line"></uni-section>
		<case-detail :selectedCase="selectedCase"></case-detail>
		<uni-section title="案件督办" type="line"></uni-section>
		<view style="padding:5px 16px">
			<uni-uform v-model="form" :label-width="85" ref="uform" :config="config" :rules="rules"
			validate-trigger="bind" :show-border="true" :label-align="align" label-position="top">
				<template #msg>
					<view style="display: flex;justify-content: space-between;">
						<text>是否短信提醒</text>
						<switch checked @change="msgChange"></switch>
					</view>
				</template>
			</uni-uform>
			<view class="footer-btn-content">
				<button size="mini" class="common-mini-btn primary-btn" @click="handleSubmit">提交</button>
				<button size="mini" class="common-mini-btn other-btn" @click="handleCancel">取消</button>
			</view>
			<!-- <uni-forms ref="baseForm" :model="caseForm" label-position="top" label-width="105">
				<uni-forms-item label="督办要求" required name="dealDesc">
					<uni-easyinput v-model="caseForm.dealDesc"  type="textarea" placeholder="督办要求">{{dealDesc}}</uni-easyinput>
				</uni-forms-item>
				<uni-forms-item >
					<template #label>
						<view style="display: flex;justify-content: space-between;">
							<text>是否短信提醒</text>
							<switch @change="handleChange"></switch>
						</view>
					</template>
				</uni-forms-item>
			</uni-forms> -->
		</view>
		<uni-popup ref="popup" type="center" background-color="#fff" class="uni-popup">
			<view class="popup-content">
				<uni-title type="h3" title="问责" align="center"></uni-title>
				<uni-forms ref="wzForm" :model="wzForm" label-position="top" label-width="105" :rules="wzRules">
					<uni-forms-item  name="dutyDesc">
						<uni-easyinput v-model="wzForm.dutyDesc"  type="textarea" placeholder="问责意见"></uni-easyinput>
					</uni-forms-item>
				</uni-forms>
				<view class="footer-btn-content">
					<button size="mini" class="common-mini-btn primary-btn" @click="handleWzSubmit">提交</button>
					<button size="mini" class="common-mini-btn other-btn" @click="handleWzCancel">取消</button>
				</view>
			</view>
		</uni-popup>
	</view>
</template>

<script>
	import { getCaseDetail } from '@/api/dums/caw/caseInfo.js'
	import {saveSupervisionCase,saveCaseUrgeDuty} from "@/api/dums/caw/urge";
	export default {
		data() {
			return {
				caseId:"",
				selectedCase:{},//案件详情
				form: { // 建议申明属性与config数组的name保持一致
					isSupervise: '1',
					urgeDeadline: null,
					urgeDesc: "",
					msg: true,
					caseId:"",
					actId:""
				},
				align:"left",
				config: [{
						name: 'urgeDeadline',
						label: '截止时间',
						component: 'uni-datetime-picker',
						extra: {
						},
						event: {
							change: function(e) {
								console.log(e)
							}
						}
					},{
					name: 'gyy',
					label: '惯用语',
					component: 'uni-data-select',
					// required:true,
					show:true,
					extra: { // 组件属性
						style: 'background-color: #fff;',
						placeholder: "请选择惯用语",
						dict:"sup_gyy",
						// localdata: [{text:1,value:1}]
					},
					event: { //推荐箭头函数这样方便和组件交互 组件方法 与组件库方法保持一致 自定义组件也保持一致 
						change: (e)=> {
							console.log(e)
							if(e){
								this.form.urgeDesc = e;
							}
						},
						input: function (e) {
							
						},
						maskClick: function (e) {
							console.log(e, 'ss')
						},
					}
				},{
						name: 'urgeDesc',
						label: '督办要求',
						component: 'uni-easyinput',
						extra: {
							type: 'textarea',
							placeholder: "督办要求",
							required:true
						},
						event: {
							change: (e) => { // 操作 form字段的示例 改变config
								console.log(e, 'ss1', this)
							}
						}
					}, {
						name: 'msg',
						isSlot:true
					}
				],
				rules: {
					urgeDesc: {
						rules: [{
							required: true,
							errorMessage: '不能为空',
						}]
					},
					urgeDeadline: {
						rules: [{
								required: true,
								errorMessage: '不能为空',
							}
						]
					}
				},
				wzForm:{
					caseId:"",
					dutyDesc:"",
					linkId:""
				},
				wzRules:{
					dutyDesc: {
						rules: [{
							required: true,
							errorMessage: '不能为空',
						}]
					},
				}
			}
		},
		methods: {
			getDetailInfo(){
				getCaseDetail({caseId:this.caseId}).then(res =>{
					console.log(JSON.stringify(res.data.linkId));
					if(res.code == 200){
						this.selectedCase = res.data;
						this.caseForm = Object.assign({},this.selectedCase);
						this.wzForm.linkId = res.data.linkId;
					}
				})
			},
			msgChange(e){
				this.form.msg = e.detail.value;
			},
			handleSubmit(){
				let _this = this;
				let form = this.$refs.uform.getForm()
				form.validate().then(res => {
					_this.form.urgeDesc = res.urgeDesc;
					_this.form.urgeDeadline = res.urgeDeadline;
					console.log(JSON.stringify(_this.form));
					saveSupervisionCase(_this.form).then(res => {
						if(res.code == 200){
							_this.$modal.msgSuccess("提交成功");
							_this.getOpenerEventChannel().emit("refreshListEvent",{});
							_this.$tab.navigateBack();
						}else{
							_this.$modal.msgError("提交失败:"+res.msg);
						}
					});
				}).catch(err => {
					console.log('表单错误信息：', err);
				})
			},
			handleCancel(){
				this.$tab.navigateBack();
			},
			handleWzSubmit(){
				let _this = this;
				this.$refs.wzForm.validate().then(res => {
					saveCaseUrgeDuty(this.wzForm).then(res1 => {
						if(res1.code == 200){
							_this.$modal.msgSuccess("提交成功");
							_this.$refs.popup.close();
						}else{
							_this.$modal.msgError("提交失败:"+res.msg);
						}
					})
				})
			},
			handleWzCancel(){
				this.$refs.popup.close();
			},
		},
		onLoad(options) {
			this.caseId = options.caseId;
			this.form.caseId = options.caseId;
			this.wzForm.caseId = options.caseId;
			this.form.actId = options.linkId;
			//获取事件信息
			this.getDetailInfo();
		},
		onNavigationBarButtonTap : function (e) {
			//console.log(this.caseId);
			if(e.index == 0){//附件
				uni.navigateTo({
					url:'../case-attach/case-attach?caseId='+this.caseId
				})
			}else if(e.index == 1){//办理进度
				uni.navigateTo({
					url:'../case-process/case-process?caseId='+this.caseId
				})
			}else{
				this.$refs.popup.open()
			}
		},
	}
</script>

<style>
	.uni-popup__wrapper{
		border-radius: 10px;
	}
	.popup-content{
		width: 320px;
		padding: 10px;
	}
</style>
